<template>
  <div>
    <a-card title="星车周期交互启动指令">
      <a slot="extra" href="#" @click="showModal">详情</a>
      <a-table :columns="columns" size="small" :data-source="data" :pagination="false"></a-table>
    </a-card>
    <a-modal v-model="visible" title="历史信息" @ok="handleOk" width="60%">
      <a-table :columns="columns" :data-source="dataHistory"></a-table>
    </a-modal>
  </div>
</template>

<script>
import { getAction } from '@/api/manage'
import { mapGetters } from 'vuex'
export default {
  name: "InteractiveLaunch",
  data() {
    const columns = [
      {
        title: '指控车',
        dataIndex: 'commandVehicleName',
        key: 'commandVehicleName',
        // scopedSlots: { customRender: 'commandVehicleName' },
      },
      {
        title: '已/未启动周期交互',
        dataIndex: 'cycleInteractionState_dictText',
        key: 'cycleInteractionState_dictText',
        // width: 80,
        // customRender: function (t) {
        //   if (t == '00') {
        //     return '未启动'
        //   } else if (t == '01') {
        //     return '已启动'
        //   }
        // }
      },
      {
        title: '校验结果',
        dataIndex: 'verifyResult_dictText',
        key: 'verifyResult_dictText',
        // ellipsis: true,
        // customRender: function (t) {
        //   if (t == '00') {
        //     return '失败'
        //   } else if (t == '01') {
        //     return '成功'
        //   }
        // }
      },


    ];
    const data = [
      {
        key: '0',
        commandVehicleName: '指控车1',
        cycleInteractionState_dictText: '00',
        verifyResult_dictText: '00',
      }, {
        key: '1',
        commandVehicleName: '指控车2',
        cycleInteractionState_dictText: '00',
        verifyResult_dictText: '01',
      },
      {
        key: '2',
        commandVehicleName: '指控车3',
        cycleInteractionState_dictText: '01',
        verifyResult_dictText: '01',
      },
      {
        key: '3',
        commandVehicleName: '指控车4',
        cycleInteractionState_dictText: '01',
        verifyResult_dictText: '00',
      },
    ];
    return {
      data,
      columns,
      visible: false,
      dataHistory: [],
      url: {
        list: '/svCycleInteraction/nmcSvCycleInteraction/queryRealTimeList',
        historyList: '/213'
      }
    };
  },
  computed: {
    ...mapGetters(['websocketMsg']),
    websocketMsg() {
      return this.$store.state.user.websocketMsg
    },
  },
  watch: {
    websocketMsg: {
      handler(val) {
        // 需要进行的操作
        if(val){
          let msg = JSON.parse(val)
          if (msg.cmd === 'RECEIVE_CONTROL_SATELLITE') {
            this.getList();
          }
        }
      },
    },
  },
  activated() {

    this.getList()
  },
  created() {
    this.getList()
  },
  methods: {
    getList() {
      getAction(this.url.list).then(res => {
        if (res.success) {
          this.data = res.result
        } else {
          this.$message.error(res.message)
        }
      })
    },
    showModal() {
      this.visible = true;
      getAction(this.url.historyList).then(res => {
        if (res.success) {
          this.dataHistory = res.result.records
        } else {
          this.$message.error(res.message)
        }
      })
    },
    handleOk(e) {
      console.log(e);
      this.visible = false;
    },
  }
}
</script>

<style>
</style>